<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
			}
			#container{
				/* display: flex;
				flex-flow: row wrap; */
				
				background-color: #f1f1f1;
			}
			.box{
				display: inline-block;
				margin: 100px;
				width: 100px;
				height: 100px;
				background-color: #99f;
			}
			.boc{
				width: 200px;
				height: 200px;
				background-color: #f40;
			}
		</style>
	</head>
	<body>
		<div id="container"></div>
		<script type="text/javascript">
			var c = document.querySelector("#container")
			for(var i = 0; i < 10; i++){
				var b = document.createElement("div")
				c.appendChild(b)
				b.className = "box"
			}
		</script>
	</body>
</html>
